<script lang="ts" setup>
import { get, post, message, loadFile } from '@/utils'
import Upload from '@/components/upload/index.vue'
import { FormInstance } from '@arco-design/web-vue'
const props = defineProps<{
  show: boolean
  id: number | string
}>()
const emit = defineEmits(['update:show', 'reset', 'confirm'])
const formRef = ref() as Ref<FormInstance>
const detail = reactive({
  goodsId: props.id,
  content: '',
  goodsScore: 0,
  id: '',
  img: '',
  sellerScore: 0,
  userAvatar: '',
  userNickName: '',
})
const submit = done => {
  formRef.value.validate(err => {
    const query = Object.assign({}, detail)
    console.log('🚀 ~ file: AddCommentModal.vue:24 ~ formRef.value.validate ~ query:', query)
    if (!err) {
      post(
        { url: '/server-shop/sys-seller/goods/comment/submit', data: query },
        ({ code, msg }) => {
          message({
            type: code == 200 ? 'success' : 'error',
            content: msg,
          })
          emit('update:show', false)
          emit('confirm')
          done(true)
        },
        () => done(false)
      )
    } else done(false)
  })
}
</script>
<template>
  <CModal v-model:visible="props.show" @before-ok="submit" :mask-closable="false" title="添加虚拟评论" @cancel="emit('update:show', false)">
    <div class="content">
      <a-form :model="detail" ref="formRef" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 16 }">
        <a-form-item label="用户头像" field="userAvatar" :rules="[{ required: true, message: '请上传虚拟用户头像' }]" :validate-trigger="[]">
          <Upload :limit="1" v-model:value="detail.userAvatar" :list="detail.userAvatar" />
        </a-form-item>
        <a-form-item label="用户昵称" field="userNickName" :rules="[{ required: true, message: '请输入虚拟用户昵称' }]" :validate-trigger="[]">
          <a-input v-model="detail.userNickName" placeholder="请输入虚拟用户昵称" />
        </a-form-item>
        <a-form-item label="虚拟评论内容" field="content" :rules="[{ required: true, message: '请输入虚拟评论内容' }]" :validate-trigger="['change', 'blur']">
          <a-textarea v-model="detail.content" placeholder="请输入虚拟评论内容" />
        </a-form-item>
        <a-form-item label="商品评分" field="goodsScore" :rules="[{ required: true, message: '请选择评分' }]" :validate-trigger="[]">
          <a-rate v-model="detail.goodsScore" placeholder="请选择评分" />
        </a-form-item>
        <a-form-item label="虚拟评论图片" field="img" :rules="[{ required: true, message: '请上传虚拟评论图片' }]" :validate-trigger="['input']">
          <Upload :list="detail.img" v-model:value="detail.img" :limit="10" />
        </a-form-item>
      </a-form>
    </div>
  </CModal>
</template>
<style lang="less" scoped></style>
